<template>
  <div>
    <el-container>
      <el-header height="50px">
        <!-- 顶部-->
        <div style="border-bottom: 1px solid #eeeeee">
          <welTop></welTop>
        </div>
      </el-header>
      <el-container>
        <el-aside width="200px">
          <el-row class="tac">
            <el-col :span="24">
              <el-menu
                default-active="2"
                class="el-menu-vertical-demo"
                @open="handleOpen"
                @close="handleClose">

                <router-link to="/ad-home">
                  <el-menu-item index="3" style="width: 200px;">
                    <i class="el-icon-document"></i>
                    <span slot="title">信息管理</span>
                  </el-menu-item>
                </router-link>
                <router-link to="/ad-home1">
                  <el-menu-item index="4" style="width: 200px;">
                    <i class="el-icon-setting"></i>
                    <span slot="title">评审</span>
                  </el-menu-item>
                </router-link>
              </el-menu>
            </el-col>
          </el-row>
        </el-aside>
        <el-main >
          <div >
            <div >
              <el-card class="box-card">
                <el-form :inline="true" :model="student_information" class="demo-form-inline" style="float: left">
                  <el-form-item label="学号查询">
                    <el-input  v-model="student_information.studentId" placeholder="电话号码"></el-input>
                  </el-form-item>
                  <el-form-item label="电话查询">
                    <el-input  v-model="student_information.phone" placeholder="电话号码"></el-input>
                  </el-form-item>
                  <el-form-item label="名字查询">
                    <el-input  v-model="student_information.name" placeholder="名字"></el-input>
                  </el-form-item>
                  <el-form-item label="是否绿色通道">
                    <el-radio v-model="student_information.greenCode" label="1">是</el-radio>
                    <el-radio v-model="student_information.greenCode" label="0">否</el-radio>
                    <el-radio v-model="student_information.greenCode" label="">不限</el-radio>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" @click="getStudentPage">查询</el-button>
                  </el-form-item>

                </el-form>
              </el-card>
            </div>
            <div>
              <el-card class="box-card" style="margin-top: 20px;height: 400px;">
                <el-table
                  :data="tableData"
                  style="width: 100%"
                  max-height="320">
                  <el-table-column
                    fixed
                    prop="studentId"
                    label="学号"
                    >
                  </el-table-column>
                  <el-table-column
                    prop="name"
                    label="姓名"
                    >
                  </el-table-column>
                  <el-table-column
                    prop="college"
                    label="学院"
                    >
                  </el-table-column>
                  <el-table-column
                    prop="classroom"
                    label="班级"
                    >
                  </el-table-column>
                  <el-table-column
                    prop="identityId"
                    label="身份证号"
                    >
                  </el-table-column>
                  <el-table-column
                    prop="phone"
                    label="电话号码"
                    >
                  </el-table-column>
                  <el-table-column
                    prop="greenCode"
                    label="是否绿色通道"
                    >
                    <template slot-scope="scope">
                      <el-tag v-if="scope.row.greenCode == 1" type="success">是</el-tag>
                      <el-tag v-else type="warning">否</el-tag>
                    </template>
                  </el-table-column>
                  <el-table-column
                    fixed="right"
                    label="操作"
                    width="120">
                    <template slot-scope="scope">
                      <el-button
                        @click.native.prevent="deleteRow(scope.$index, scope.row)"
                        type="text"
                        size="small">
                        移除
                      </el-button>
                    </template>
                  </el-table-column>
                </el-table>
                <div style="margin-top: 30px;">
                  <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="page.page_index"
                    :page-sizes="[5, 10, 20, 50]"
                    :page-size="page.page_size"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="page.total">
                  </el-pagination>
                </div>
              </el-card>
            </div>
          </div>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import welTop from "@/components/welTop"
export default {
  name: "ad-main",
  components: {
    welTop
  },data(){
    return{
      page:{
        page_index:1,
        page_size:5,
        total:0,
        search: ''
      },
      student_information:{

      },
      tableData: [],formInline: {
        user: '',
        region: ''
      }
    }
  },
  mounted() {
    this.getStudentPage()
  },methods: {
    deleteRow(index, rows) {
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$axios.delete('/admin-deleteStudentInfo/'+rows.id).then(res => {
          if(res.data.code == 0){
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
            this.getStudentPage()
          }
          else{
            this.$message.error(res.data.msg);
          }
        }).catch(err => {
          return Promise.reject(err)
        })

      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },onSubmit() {
      console.log('submit!');
    },handleSizeChange(val) {
      this.page.page_size = val
      this.getStudentPage()
    },
    handleCurrentChange(val) {
      this.page.page_index = val
      this.getStudentPage()
    },
    getStudentPage() {

      this.$axios.post('/admin-getStudentInfoAdmin/'+this.page.page_index+"/"+this.page.page_size, this.student_information).then(res => {
        console.log(res)
        this.page.total = res.data.data.total
        this.page.page_size = res.data.data.size
        this.page.page_index = res.data.data.current
        this.tableData = res.data.data.records
      }).catch(err => {
        return Promise.reject(err)
      })
    }

  }
}
</script>

<style scoped>
a{
  text-decoration: none;
}
.el-header, .el-footer {
  /*background-color: #B3C0D1;*/
  color: #333;
  text-align: center;
  line-height: 17px;
  /*height: 100px;*/
}


.el-aside {

  /*background-color: #E9EEF3;*/
  color: #333;
  text-align: center;
  line-height: 200px;
}

.el-main {
  background-color: #ffffff;
  color: #333;
  /*text-align: center;*/
  /*line-height: 160px;*/
}

body > .el-container {
  margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}

.box-card {
  /*width: 480px;*/
}
</style>
